/*
 * @Author: 抠脚本人
 * @QQ: 742374184
 * @Date: 2022-05-12 16:20:53
 * @LastEditTime: 2022-11-09 10:31:13
 * @Description:一个画板示例
 * 灵感来之不易,积累创造奇迹
 */
"ui";
import { toColorInt } from "color";
import { Activity, setMainActivity } from "ui/index";
import { loadDrawingBoard, setColor } from "./element-aj/DrawingBoard.mjs";
import { registerComponent, ColoredButton } from "./element-aj/index.mjs";
//等待加载生成dex
await loadDrawingBoard();
//注册自定义组件库
registerComponent(ColoredButton);
class MainActivity extends Activity {
	get initialStatusBar() {
		return { color: "#ffffff", light: true };
	}

	get layoutXml() {
		return `
		<column>
			<appbar w="*" h="auto">
				<toolbar id="toolbar" title="灵魂画家"/>
			</appbar>
			<row w="*" padding="10 0">
				<ColoredButton id="btn1" text="黑色" color="#000000" layout_weight="1" margin="5 0"/>
				<ColoredButton id="btn2" text="绿色" color="#00ff00" layout_weight="1" margin="5 0"/>
				<ColoredButton id="btn3" text="红色" color="#ff0000" layout_weight="1" margin="5 0"/>
				<ColoredButton id="btn4" text="蓝色" color="#0000ff" layout_weight="1" margin="5 0"/>
			</row>
			<materialcard w="*" h="*" margin="10 0">
				<org.drawing.DrawingBoard w="*" h="*"/>
			</materialcard>
		</column>`;
	}

	onContentViewSet(view) {
		const { btn1, btn2, btn3, btn4 } = view.binding;
		btn1.on("click", () => {
			setColor(parseColor("#000000"));
		});
		btn2.on("click", () => {
			setColor(parseColor("#00ff00"));
		});
		btn3.on("click", () => {
			setColor(parseColor("#ff0000"));
		});
		btn4.on("click", () => {
			setColor(parseColor("#0000ff"));
		});
	}
}
setMainActivity(MainActivity);
//更直观的处理颜色
function parseColor(str) {
	return toColorInt(Number(str.replace("#", "0xff")));
}
